
<div style="POSITION: relative" id="content">
  <h3>easyUI Dialog自定义Toolbar和button</h3>
  <div id="article_content" class="article_content">
    <p>你可以创建一个<span style="font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; font-size:14px; text-align:left">dialog 和toolbar和button,创建可以从<span style="font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; font-size:14px; text-align:left">HTML 标记,这个教程描述如何添加<span style="font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; font-size:14px; text-align:left">toolbar
      和 button到dialog,没有任何的javascript代码.</span></span></span></p>
    <p><span style="font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; font-size:14px; text-align:left"><span style="font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; font-size:14px; text-align:left"><span style="font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; font-size:14px; text-align:left"><img src="documentation/images/1344824365_6799.png" alt=""><br>
      </span></span></span></p>
    <p><span style="font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; font-size:14px; text-align:left"><span style="font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; font-size:14px; text-align:left"><span style="font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; font-size:14px; text-align:left"></span></span></span></p>
    <h4 style="font-size:16px; color:rgb(204,0,0); margin:10px 0px; font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; text-align:left"> 创建 Dialog</h4>
    <pre name="code" class="html">&lt;div id=&quot;dd&quot; class=&quot;easyui-dialog&quot; title=&quot;My Dialog&quot; style=&quot;width:400px;height:200px;padding:10px&quot;  
        toolbar=&quot;#dlg-toolbar&quot; buttons=&quot;#dlg-buttons&quot;&gt;  
    Dialog Content.  
&lt;/div&gt;  </pre>
    <p></p>
    <p><span style="font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; font-size:14px; text-align:left"><span style="font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; font-size:14px; text-align:left"><span style="font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; font-size:14px; text-align:left"></span></span></span></p>
    <h4 style="font-size:16px; color:rgb(204,0,0); margin:10px 0px; font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; text-align:left"> 创建Toolbar</h4>
    <pre name="code" class="html">&lt;div id=&quot;dlg-toolbar&quot;&gt;  
    &lt;table cellpadding=&quot;0&quot; cellspacing=&quot;0&quot; style=&quot;width:100%&quot;&gt;  
        &lt;tr&gt;  
            &lt;td&gt;  
                &lt;a href=&quot;#&quot; class=&quot;easyui-linkbutton&quot; iconCls=&quot;icon-edit&quot; plain=&quot;true&quot;&gt;Edit&lt;/a&gt;  
                &lt;a href=&quot;#&quot; class=&quot;easyui-linkbutton&quot; iconCls=&quot;icon-help&quot; plain=&quot;true&quot;&gt;Help&lt;/a&gt;  
            &lt;/td&gt;  
            &lt;td style=&quot;text-align:right&quot;&gt;  
                &lt;input&gt;&lt;/input&gt;&lt;a href=&quot;#&quot; class=&quot;easyui-linkbutton&quot; iconCls=&quot;icon-search&quot; plain=&quot;true&quot;&gt;&lt;/a&gt;  
            &lt;/td&gt;  
        &lt;/tr&gt;  
    &lt;/table&gt;  
&lt;/div&gt;  </pre>
    <p></p>
    <p><span style="font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; font-size:14px; text-align:left"><span style="font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; font-size:14px; text-align:left"><span style="font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; font-size:14px; text-align:left"></span></span></span></p>
    <h4 style="font-size:16px; color:rgb(204,0,0); margin:10px 0px; font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; text-align:left"> 创建 Button</h4>
    <pre name="code" class="html">&lt;div id=&quot;dlg-buttons&quot;&gt;  
    &lt;table cellpadding=&quot;0&quot; cellspacing=&quot;0&quot; style=&quot;width:100%&quot;&gt;  
        &lt;tr&gt;  
            &lt;td&gt;  
                &lt;img src=&quot;email.gif&quot;/&gt;  
            &lt;/td&gt;  
            &lt;td style=&quot;text-align:right&quot;&gt;  
                &lt;a href=&quot;#&quot; class=&quot;easyui-linkbutton&quot; iconCls=&quot;icon-save&quot; onclick=&quot;javascript:alert('save')&quot;&gt;Save&lt;/a&gt;  
                &lt;a href=&quot;#&quot; class=&quot;easyui-linkbutton&quot; iconCls=&quot;icon-cancel&quot; onclick=&quot;javascript:$('#dd').dialog('close')&quot;&gt;Close&lt;/a&gt;  
            &lt;/td&gt;  
        &lt;/tr&gt;  
    &lt;/table&gt;  
&lt;/div&gt;  </pre>
    注意:<span style="font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; font-size:14px; text-align:left">&nbsp;dialog的toolbar 和 buttons也可以通过string&#20540;指定,它将充当作为一个选择器去选择一个适当的DIV元素和添加&nbsp;<span style="font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; font-size:14px; text-align:left">toolbar
    或者 buttons的位置.</span></span>
    <h4 style="font-size:16px; color:rgb(204,0,0); margin:10px 0px; font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; text-align:left"> 下载 &nbsp;EasyUI 示例:</h4>
    <div style="font-size:14px; font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; text-align:left; padding-left:50px"> <a href="http://jquery-easyui.googlecode.com/svn/trunk/share/tutorial/window/easyui-dialog-demo2.zip" target="_blank" class="download-link" style="color:rgb(0,0,255)">easyui-dialog-demo.zip</a></div>
    <br>
  </div>
</div>
<SCRIPT type=text/javascript>
	dp.SyntaxHighlighter.ClipboardSwf = 'documentation/js/clipboard.swf'/*tpa=http://jeasyui.com/SyntaxHighlighter/Scripts/clipboard.swf*/;
	dp.SyntaxHighlighter.HighlightAll('code');
</SCRIPT>